<template>
<div>

    <div align="center">
          <h1>试卷名称:{{paper.paperName}} 试卷总分:{{paper.paperScore}} 试卷时长:{{paper.paperTime}}</h1>
    </div>

  <h1>一:单选题</h1>
  <template v-for="(x,index) in signList">
  <el-card class="box-card">
    <div slot="header" class="clearfix">
      <span>{{index+1}}:{{x.quContent}}</span>
    </div>
    <div  class="text item">
      <input type="radio" value="A" :name="'s'+index"/>A:{{x.quAoption}}
    </div>
    <div  class="text item">
      <input type="radio" value="B" :name="'s'+index"/>B:{{x.quBoption}}
    </div>
    <div  class="text item">
      <input type="radio" value="C" :name="'s'+index"/>C:{{x.quCoption}}
    </div>
    <div  class="text item">
      <input type="radio" value="D" :name="'s'+index"/>D:{{x.quDoption}}
    </div>
  </el-card>
  </template>

  <h1>二:多选题</h1>
  <template v-for="(x,index) in moreList">
    <el-card class="box-card">
      <div slot="header" class="clearfix">
        <span>{{index+1}}:{{x.quContent}}</span>
      </div>
      <div  class="text item">
        <input type="checkbox" value="A" :name="'m'+index"/>A:{{x.quAoption}}
      </div>
      <div  class="text item">
        <input type="checkbox" value="B" :name="'m'+index"/>B:{{x.quBoption}}
      </div>
      <div  class="text item">
        <input type="checkbox" value="C" :name="'m'+index"/>C:{{x.quCoption}}
      </div>
      <div  class="text item">
        <input type="checkbox" value="D" :name="'m'+index"/>D:{{x.quDoption}}
      </div>
    </el-card>
  </template>

  <h1>三:判断题</h1>
  <template v-for="(x,index) in judgeList">
    <el-card class="box-card">
      <div slot="header" class="clearfix">
        <span>{{index+1}}:{{x.quContent}}</span>
      </div>
      <div  class="text item">
        <input type="radio" value="√" :name="'j'+index"/>√
      </div>
      <div  class="text item">
        <input type="radio" value="×" :name="'j'+index"/>×
      </div>

    </el-card>
  </template>

</div>

</template>

<script>
    export default {
        name: "PaperShow",
        data(){
          return{
            paperForm:{//试卷表单
              paperName:"",
              paperTime:"",
              paperScore:"",
            },
            paper:{},//试卷对象
            signList:[],//单选题数组
            moreList:[],//多选题数组
            judgeList:[]//判断题数组

          }
        },
        methods:{
              loadData(){//加载试卷信息
                var self = this;
                //发送ajax请求
                this.$http.post("/paper-info/paperShow",this.$qs.stringify(this.paperForm)).then(function (rs) {
                  if(rs.data.code==200){
                    self.paper = rs.data.data;
                    //取出各种题型
                    for(var i =0;i<self.paper.list.length;i++){
                          if(self.paper.list[i].quType=="单选题"){
                              //添加到单选题数组中
                              self.signList.push(self.paper.list[i]);
                          } else if(self.paper.list[i].quType=="多选题"){
                              //添加到多选题数组中
                              self.moreList.push(self.paper.list[i]);
                          }else{
                              //添加到判断题数组中
                              self.judgeList.push(self.paper.list[i]);
                          }
                    }
                  }else{
                    //清空
                    self.paper={};
                  }
                })
              }
        },
        created() {
          //获取试卷名称，总分，时长
           this.paperForm = this.$route.query;
           this.loadData();
        }
    }
</script>

<style scoped>

</style>
